<template>
  <h1>一个人的信息</h1>
  <h2 v-show="person.name">姓名：{{ person.name }}</h2>
  <h2>年龄：{{ person.age }}</h2>
  <button @click="test">触发Hello事件</button>
  <hr>
  <slot name="slot1"></slot>
  <hr>
  <slot name="slot2"></slot>
</template>

<script>
import {ref, reactive} from "vue";

export default {
  name: "Demo",
  props: ['msg', 'school'],
  emits:['hello'], // 用于注册VC的自定义事件，可不写，但会报警
  setup(props, context) {
    console.log(props);
    let person = reactive({
      name:'张三',
      age:18,
    });
    function test() {
      context.emit('hello', '张三');
    }
    return {
      person,
      test
    }
  },
}
</script>

<style scoped>

</style>